<script setup>
import {ref} from "vue";
import request  from '@/api/request'
let emits=defineEmits(["ref-table"])
let props = defineProps(["data1"])
let onSubmit=()=>{
     request({
        url: '/orderSteps/update',
        method: 'put',
        data: {
            ...orderSteps.value,
            sequenceId : props.data1.sequenceId//       
        }
    }).then(res => {
        emits("ref-table")
    })
}
let orderSteps=ref({...props.data1})
let sequenceId= ref(1)
let num1 = ref(1)
const handleChange2 = (value=number) => {
  console.log(value)
}
const handleChange1 = (value=number) => {
  console.log(value)
}

</script>
<template>
    <div>
        <el-card>
            <template #header>
                <el-form :model="orderSteps" ref="form"  label-width="80px" :inline="false" size="default" class="card_wrap">
                    <el-form-item  label="顺序编号" class="c_item">
                            
                            <el-input-number v-model="orderSteps.sequenceId" :min="1" :max="2000" @change="handleChange1" disabled/>
                    </el-form-item>
                    <el-form-item label="材料URL" class="c_item">
                            
                            <el-input v-model="orderSteps.materialUrl" style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="辅助设备" class="c_item">
                           
                            <el-input v-model="orderSteps.auxiliaryEquipment" style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="辅助材料" class="c_item">
                           
                            <el-input v-model="orderSteps.auxiliaryMaterials" style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="步骤说明" class="c_item_big">
                            
                            <el-input v-model="orderSteps.stepDescription" placeholder="请输入步骤说明" style="width: 800px;"></el-input>
                    </el-form-item>
                    <el-form-item label="备注" class="c_item_big">
                            
                            <el-input v-model="orderSteps.remarks" placeholder="请输入内容" style="width: 800px;"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="onSubmit">立即修改</el-button>
                    </el-form-item>
                </el-form>
            </template>
        </el-card>
    </div>
</template>
<style scoped>
.c_item {
    flex: 1;
    margin: 0px 5px 15px 0;
    width: calc((100%-10px)/2);
    min-width: calc((100% - 10px)/2);
    max-width: calc((100% - 10px)/2);

    &:nth-child(3n) {
        margin-right: 0;
    }
}
.c_item_big {
    flex: 2;
    margin: 0px 5px 15px 0;
    width: calc((100%-10px)/1);
    min-width: calc((100% - 10px)/1);
    max-width: calc((100% - 10px)/1);

    &:nth-child(3n) {
        margin-right: 0;
    }
}
.card_wrap {
    width: 98%;
    
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
</style>